@charset "UTF-8";

/**
  * 全局样式快捷
  **/
.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.w-50 {
  width: 50%;
}

.h-50 {
  height: 50%;
}

.w-100vw {
  width: 100vw;
}

.h-100vh {
  height: 100vh;
}

.min-h-100vh {
  min-height: 100vh;
}

.margin-auto {
  margin: auto;
}

.max-button {
  width: 100%;
  height: 2.8rem;
  text-align: center;
  line-height: 2.8rem;
  color: #fff;
  font-size: 1.2rem;
  background: rgba(67, 128, 255, 1);
  border-radius: 4rem;
}

.border-1 {
  border: 1px solid #EEEEEE;
}
.border-b-1 {
  border-bottom: 1px solid #EEEEEE;
}

.cursor-pointer {
  cursor: pointer;
}

.avatar {
  min-width: 28px;
  border: 1px solid rgba(0, 0, 0, 0.164);
  border-radius: 50rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;

}

.avatar::before {
  content: "";
  padding-top: 100%;
  float: left;
}

.avatar::after {
  content: "";
  display: block;
  clear: both;
}

.position-r {
  position: relative;
}

.position-a {
  position: absolute;
}

.position-f {
  position: fixed;
}

.bg-center {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.text-one {
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-two {
  -o-text-overflow: -o-ellipsis-lastline;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

.text-three {
  -o-text-overflow: -o-ellipsis-lastline;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}

//文本对其方向
@textAlign: left, right, center;

each(@textAlign, {
    .text-align-@{value} {
      text-align: @value;
    }
  }

) //文本大小

each(range(12, 36, 2), {
    .font-@{value} {
      font-size: (@value * 1px);
    }
  }

) //文本字重
.font-weight-b {
  font-weight: bold;
}
each(range(100, 800, 100), {
    .font-weight-@{value} {
      font-weight: @value;
    }
  }

) // 间距

each(range(4, 40, 4), {
    .m-all-@{value} {
      margin: (@value * 1px)
    }

    .m-r-@{value} {
      margin-right: (@value * 1px)
    }

    .m-l-@{value} {
      margin-left: (@value * 1px)
    }

    .m-t-@{value} {
      margin-top: (@value * 1px)
    }

    .m-b-@{value} {
      margin-bottom: (@value * 1px)
    }

    .p-all-@{value} {
      padding: (@value * 1px)
    }

    .p-r-@{value} {
      padding-right: (@value * 1px)
    }

    .p-l-@{value} {
      padding-left: (@value * 1px)
    }

    .p-t-@{value} {
      padding-top: (@value * 1px)
    }

    .p-b-@{value} {
      padding-bottom: (@value * 1px)
    }

  }

);

.color-0-15 {
  color: rgba(0, 0, 0, 0.15)
}

.color-0-45 {
  color: rgba(0, 0, 0, 0.45)
}

.color-0-65 {
  color: rgba(0, 0, 0, 0.65)
}

.color-0-85 {
  color: rgba(0, 0, 0, 0.85)
}

.color-primary {
  color: #1890FF
}

.text-left {
  text-align: left
}

.text-center {
  text-align: center
}

.text-right {
  text-align: right
}

.text-underline {
  text-decoration: underline
}

.text-through {
  text-decoration: line-through
}

.cursor-pointer {
  cursor: pointer
}
